﻿<%@ Page Title="" Language="C#" MasterPageFile="~/postioin.Master" AutoEventWireup="true" CodeBehind="proList.aspx.cs" Inherits="WebApplication1.proList" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

    <style>
       article {
            width:80%;
            margin:0 auto;
            /*height:1000px;*/
        }
        .bodyLeft, .bodyRight {
            float:left;
        }
        .bodyLeft {
            width:82%;
            height:100%;
        }
        .bodyRight {
            width:18%;
            float:right;
            height:100%;
            margin-top:5px;
            background-color:#f35555;
        }
        .bodyLeftTop {
            width:100%;
            height:12%;
        }
        .bodyLeftTopT {
            width:100%;
            height:40%;
        }
        .bodyLeftTopTLeft {
            margin-left:20px;
            line-height:30px;
        }
        .bodyT {
            color:blue;
        }
        .bodyLeftTopTLeft {
            float:left;
        }
        .bodyLeftTopTRight {
            float:right;
            line-height:30px;
            margin-right:5px;
        }
        .bodyLeftTopTRight > img {
            margin-top:2px;
        }
        .bodyLeftTopC {
            width:100%;
            height:5px;
            background-color:blue;
        }
        .bodyLeftTopBText {
            float:left;
            margin-top:16px;
            margin-left:30px;
            cursor:pointer;
        }
            .bodyLeftTopBText:hover {
                background-color:blue;
                color:#fff;
            }
        .T {
            font-weight:bold;
            margin-left:0px;
            margin-left:20px;
            color:blue;
        }
        .bodyLeftBotton {
            margin-top:20px;
        }
        .bodyLeftBottonT {
            float:left;
            width:24%;
            height:230px;
            margin-left:1%;
            background-color:#bcbcbc;
        }
        .bodyT {
            margin-left:0%;
        }
        .bodyLeftBottonTop {
            width:100%;
            height:73%;
        }
        .bodyLeftBottonTop>img {
            width:100%;
            height:100%;
        }
        .UI {
            position:absolute;
            left:21%;
            top:57%;
            color:#fff;
            text-align:center;
            line-height:30px;
            width:72px;
            height:30px;
            background-color:#f35555;
        }
        .bodyLeftBottonTTop {
            color:black;
            text-align:center;
            margin-top:8px;
            cursor:pointer;
        }
        .bodyLeftBottonTBott {
            margin-left:20px;
            color:#fff;
        }
        .bodyLeftBottonTTop:hover {
            color:blue;
        }
        .bodyRightBottton {
            width:90%;
            height:210px;
            margin:0 auto;
            margin-top:5px;
            cursor:pointer;
            background-color:#c6c3c3;
        }
        .bodyRightBtTop {
            width:100%;
            height:73%;
        }
            .bodyRightBtTop > img {
                width:100%;
                height:100%;
            }
        .bodyRight {
            background-color:#bcbcbc;
        }
        .myUI {
            position:absolute;
            color:#fff;
            text-align:center;
            line-height:30px;
            width:72px;
            height:30px;
            top:46.9%;
            Right:10.7%;
            background-color:#f35555;
        }
        .bodyRightBtnT {
            font-size:15px;
        }
        .bodyRightBtnB {
            text-align:center;
            color:#a59f9f;
        }
        .bodyRightBtnT:hover {
            color:blue;
        }
    </style>
    <article>
  <div class="bodyLeft">
            <div class="bodyLeftTop">
                <div class="bodyLeftTopT">
                    <div class="bodyLeftTopTLeft"><span class="bodyT">进行中的项目</span>&nbsp;&nbsp;&nbsp; 已完成的项目</div>
                    <div class="bodyLeftTopTRight">
                        <img src="img/icon-home.png" />&nbsp;主页&nbsp;>&nbsp;咨询中心
                    </div>
                    <div style="clear:both"></div>
                </div>
                <div class="bodyLeftTopC"></div>
                <div class="bodyLeftTopB">
                    <div class="bodyLeftTopBText T">项目分类：</div>
                    <div class="bodyLeftTopBText">全部</div>
                    <div class="bodyLeftTopBText">UI设计</div>
                    <div class="bodyLeftTopBText">数据库设计</div>
                    <div class="bodyLeftTopBText">网站设计</div>
                    <div class="bodyLeftTopBText">网站制作</div>
                    <div class="bodyLeftTopBText">APP制作</div>
                    <div class="bodyLeftTopBText">微信制作</div>
                    <div class="bodyLeftTopBText">应用程序制作</div>
                    <div style="clear:both"></div>
                </div>
            </div>
            <div class="bodyLeftBotton">
                <div class="bodyLeftBottonT bodyT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>

                <div style="clear:both"></div><br />
                <div class="bodyLeftBottonT bodyT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div style="clear:both"></div><br />
                <div class="bodyLeftBottonT bodyT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div style="clear:both"></div><br />
                <div class="bodyLeftBottonT bodyT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyLeftBottonT">
                    <div class="bodyLeftBottonTop">
                        <img src="img/demo-right.jpg" />
                        <div class="UI">UI设计</div>
                    </div>
                    <div class="bodyLeftBottonTB">
                        <div class="bodyLeftBottonTTop">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyLeftBottonTBott">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div style="clear:both"></div><br />
            </div>
        </div>
        <div class="bodyRight">
            <div class="bodyRightTop">热门推荐</div>
            <div class="bodyRightBt">
                <div class="bodyRightBottton">
                    <div class="bodyRightBtTop">
                        <img src="img/demo-right.jpg" /></div>
                    <div class="myUI">UI设计</div>
                    <div class="bodyRightBtBotton">
                        <div class="bodyRightBtnT">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyRightBtnB">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyRightBottton">
                    <div class="bodyRightBtTop">
                        <img src="img/demo-right.jpg" /></div>
                    <div class="myUI">UI设计</div>
                    <div class="bodyRightBtBotton">
                        <div class="bodyRightBtnT">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyRightBtnB">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyRightBottton">
                    <div class="bodyRightBtTop">
                        <img src="img/demo-right.jpg" /></div>
                    <div class="myUI">UI设计</div>
                    <div class="bodyRightBtBotton">
                        <div class="bodyRightBtnT">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyRightBtnB">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
                <div class="bodyRightBottton">
                    <div class="bodyRightBtTop">
                        <img src="img/demo-right.jpg" /></div>
                    <div class="myUI">UI设计</div>
                    <div class="bodyRightBtBotton">
                        <div class="bodyRightBtnT">[UI设计]湖南驾考弹出框插画</div>
                        <div class="bodyRightBtnB">
                            <img src="img/icon-time.png" />2015-12-12<img src="img/icon-view.png" />999</div>
                    </div>
                </div>
            </div>
        </div>
        <div style="clear:both"></div>
    </article>

</asp:Content>
